import React, { Component, PropTypes } from 'react';
import axios from 'axios';
import { connect } from 'react-redux';
import store from '../../store';

class DeletePreview extends Component{

    getTime(){
        var time = new Date();
        time = time.toISOString();
        time = time.substring(0,10);
        return time;
    }

    closeFrame(e){
        store.dispatch({
            type: 'DELETE_PREVIEW',
            deleteFolder: false
        });
        $('.backcover').hide();
    }

    delete(e){
        var { activeFolder, activePreview, previewList } = this.props;

        var _state = [];
        var _that = this;
        var previewId = '';
        var filename = '';

        for(var [index, value] of previewList.entries()){
            if(value.secondnav === activePreview) {
                previewId = value.id;
                if ( previewId === 'upload') {
                    filename = value.filename;
                }

                continue;
            }
            
            _state.push(value);
        }

        axios.get('/deletePreview',{
            params: {
                name: activePreview,
                firstNav: activeFolder,
                time: _that.getTime(),
                previewId: previewId,
                filename: filename
            }
        })
        .then(function(response){
            console.log('123456')
            store.dispatch({
                type: 'GET_PREVIEW',
                previewList: _state
            })
            _that.closeFrame(e)
        })
        .catch(function(error){
            console.log(error)
            alert('系统出错')
        })
    
        


    }

    render(){

        var { deletePreview, activePreview, activeFolder } = this.props;
        var classs = 'new-container hide';
        if (deletePreview) classs = 'new-container';

       return(
            <section id="delete-preview" className={classs}>
                <div  className="new-title">
                    文件删除
                    <i className="icon-remove" onClick={this.closeFrame.bind(this)}></i>
                </div>
                <div>
                    确定删除
                    <span className="warn">{activeFolder}</span>
                    文件夹下的
                    <span className="warn">{activePreview}</span>
                    文件吗？
                </div>
                <div>
                    <button type="button" className="cancle-btn" onClick={this.closeFrame.bind(this)}>取消</button>
                    <button type="button" className="delete-btn" onClick={this.delete.bind(this)}>删除</button>
                </div>
            </section>
       )
    }

}


const mapStateToProps  = (state) => {
    return {
        previewList: state.previewReducer.previewList,
        activePreview: state.previewReducer.activePreview,
        deletePreview: state.previewReducer.deletePreview,
        activeFolder: state.folderReducer.activeFolder
    }
}

const mapDispatchToProps = (dispatch, ownProps) => {
    return {}
}
export default connect(
    mapStateToProps,
    mapDispatchToProps
)(DeletePreview);